

/*
Copyright (c) 2008, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 3.0.0pr2
*/
/* reset */
html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;}
/* fonts */
body{font:13px/1.231 tahoma,clean,sans-serif;*font-size:small;*font:x-small;}select,input,button,textarea{font:99% arial,helvetica,clean,sans-serif;}table{font-size:inherit;font:100%;}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;}

body {color:#444;background:#444;padding-bottom:30px;}
.page {	width:960px;max-width:90%;margin:0 auto;background:#FFF;padding:15px;-moz-border-radius:10px;color:#444;}
#header {
	margin-bottom:30px;
	-moz-box-shadow:0px 3px 6px #444;
	background:#FFF;
	overflow:hidden;_overflow:visible;_zoom:1;
}
.dynBg {background:#444;color:#FFF !important;}
h1 {font-size:1.2em;margin:0 0 20px 0;font-weight:bold;padding:5px;}
h2 {font-size:1.1em;margin:0 0 10px 10px;font-weight:bold;padding:5px;}
h3 {font-size:1em;margin:0 0 5px 20px;font-weight:bold;padding:5px;}
form,strong, ul, p {margin:0 0 10px 20px;}
li {margin-left:10px;list-style:disc inside;}
.wcag{padding:0;margin:0;color:#fff;}
.wcag  li {list-style:none;}
.wcag a{position:absolute;left:-100%;}
.wcag a:focus,.wcag a:active {position:static;left:-100%;}
p.code {white-space:pre;font-family:monospace;border:2px solid #AAA;background:#EEE;padding:10px;}
#tools {float:right;margin-right:10px;clear:left;}
#tools li {list-style:none;}
#tools a {color:#444;}
#right {
	float:right;
	width:18%;
	-moz-box-shadow:0px 0px 12px #444;
	padding:10px;
	margin:10px 0;
}
#right li {margin:0;list-style:none;}
#right a {color:#fff;font-size:1.1em;}
#ctn {overflow:hidden;_overflow:visible;_zoom:1;width:78%;margin-left:10px;}
#main {overflow:hidden;_overflow:visible;_zoom:1;margin-bottom:30px;}

.test {
	border:2px solid #444;
	width:100px;
	height:100px;
	float:left;
	margin:10px 20px 10px 0;
	background:#fff;
	max-width:100%;
}
.test img {display:block;max-width:100%;min-width:90%;}
.test span {position:absolute;}

/***
 *  - mooRainbow: defaultCSS
 * author: w00fz <w00fzIT@gmail.com>
 */

#mooRainbow { font-size: 11px; color: #000; z-index:1001;margin-left:245px;margin-top:-185px;}

.moor-box {
	width: 390px; 
	height: 310px; 
	border: 1px solid #636163; 
	background-color: #f9f9f9;
}
.moor-overlayBox {
	width: 256px; /* Width and Height of the overlay must be setted here: default 256x256 */
	height: 256px; 
	margin-top: 9px; 
	margin-left: 9px;
	border: 1px solid #000;
}
.moor-slider {
	border: 1px solid #000;
	margin-top: 9px; 
	margin-left: 280px;
	width: 19px; /* if you want a bigger or smaller slider... */
	height: 256px;
}
.moor-colorBox {
	border: 1px solid #000; 
	width: 59px; 
	height: 68px; 
	margin-top: 20px; 
	margin-left: 315px;
}
.moor-currentColor { /* Bottom Box Color, the backup one */
	margin-top: 55px; 
	margin-left: 316px; 
	width: 59px; 
	height: 34px;
}
.moor-okButton {
	font-family: Tahoma;
	font-weight: bold;
	font-size: 11px;
	margin-top: 278px;
	margin-left: 8px;
	background: #e6e6e6;
	height: 23px;
	border: 1px solid #d6d6d6;
	border-left-color: #f5f5f5;
	border-top-color: #f5f5f5;
}
#mooRainbow label {
	font-family: mono;
}
/* Following are just <label> */
.moor-rLabel {
	margin-top: 100px;
	margin-left: 315px;
}
.moor-gLabel {
	margin-top: 125px;
	margin-left: 315px;
}
.moor-bLabel {
	margin-top: 150px;
	margin-left: 315px;
}
.moor-HueLabel {
	margin-top: 190px;
	margin-left: 315px;
}
span.moor-ballino { /* Style hue ° (degree) !! */
	margin-top: 190px;
	margin-left: 370px;
}
.moor-SatuLabel {
	margin-top: 215px;
	margin-left: 315px;
}
.moor-BrighLabel {
	margin-top: 240px;
	margin-left: 315px;
}
.moor-hexLabel {
	margin-top: 275px;
	margin-left: 280px;
}

/* <input> */
.moor-rInput, .moor-gInput, .moor-bInput, .moor-HueInput, .moor-SatuInput, .moor-BrighInput { 
	width: 30px;
}
.moor-hexInput {
	width: 55px;
}
.moor-cursor {
	background-image: url(skin/moor_cursor.gif); 
	width: 12px;
	height: 12px;
}
.moor-arrows {
	background-image: url(skin/moor_arrows.gif);
	top: 9px; 
	left: 270px;
	width: 41px;
	height: 9px;
}
.moor-chooseColor { /* Top Box Color, the choosen one */
	margin-top: 21px; 
	margin-left: 316px; 
	width: 59px; 
	height: 34px;
}